<template>
  <div>
    <input
      type="text"
      v-model="dats"
      placeholder="代办事项"
      @keydown.enter="search(dats)"
    />
    <button @click="search(dats)">提交</button>
  </div>
</template>

<script>
export default {
  components: {},
  name: "",
  data() {
    return {
      dats: "",
    };
  },
  mounted() {},
  methods: {
    //提交事件
    search(dats) {
      this.$store.commit("search", dats);
      // this.dats = ""; //提交后赋空
    },
  },
  computed: {},
  watch: {},
};
</script>

<style lang="scss" scoped>
div {
  margin: 20px;

  input {
    width: 240px;
    height: 30px;
    border-radius: 10px;
  }
  button {
    width: 60px;
    height: 35px;
    margin-left: 10px;
    background-color: pink;
    color: white;
    border: none;
    border-radius: 20px;
  }
}
</style>
